<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="http://unpkg.com/vue@next"></script>
</head>

<body>

    <!-- 
    context 中attrs 父组件键传过来的值 None-props 不用props接收则会在这里显示 如果被props接收则不会显示
    -->
    <!DOCTYPE html>
    <html lang="en">

    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
        <script src="http://unpkg.com/vue@next"></script>
    </head>

    <body>
        <div id="root"></div>
    </body>
    <script>
        let app = Vue.createApp({
            template: '<child value="aa" >虚拟</child>',
        })
        app.component('child', {
            template: '<div>child</div>',
            // props: ['value'], //原本获取父组件的值
            setup(props, context) {
                const { attrs, slots, emit } = context
                console.log(attrs.value) //父组件键传过来的值 None-props  不用props接收则会在这里显示 如果被props接收则不会显示
                return {}
            },
        })
        app.mount('#root')
    </script>

    </html>
    </script>

</html>